<template>
    <router-link :to="`/product?id=${proItem.id}`" class="block bg-white">
        <div class="bg-contain bg-no-repeat bg-center pb-[100%]" :style="`background-image: url('${proItem.thumb}');`">
        </div>
        <div class="mt-3 sm:mt-5 space-y-2.5 px-2.5">
            <h2 class="text-sm sm:text-base">{{ proItem.goods_name }}</h2>
            <div class="text-xs sm:text-sm">Converse</div>
            <div class="font-semibold">Ł {{ proItem.pirce }}</div>
        </div>
    </router-link>
</template>
<script>
export default {
    props: ["proItem"],
    data() {
        return {

        }
    },
};
</script>
<style lang='' scoped>
</style>